<template>
	<div>
		<el-card>
			<template #header>
				<div class="card-header">
					<el-button type="primary" @click="onAddShop">添加</el-button>
				</div>
			</template>
			<el-table :data="tableData" style="width: 100%">
				<el-table-column prop="id" label="ID" width="180" />
				<el-table-column prop="shopName" label="名称" width="180" />
				<el-table-column prop="shopCover" label="封面">
					<template #default="scope">
						<el-image style="width: 100px; height: 100px" :src="scope.row['shopCover']" fit="contain" />
					</template>
				</el-table-column>
				<el-table-column prop="shopLogo" label="Logo">
					<template #default="scope">
						<el-image style="width: 100px; height: 100px" :src="scope.row['shopLogo']" fit="contain" />
					</template>
				</el-table-column>
				<el-table-column prop="phone" label="电话" />
				<el-table-column prop="status" label="状态" />
				<el-table-column prop="createTime" label="创建时间" />
				<el-table-column prop="updateTime" label="更新时间" />
				<el-table-column fixed="right" label="操作" width="120">
					<template #default>
						<el-button link type="primary" size="small">编辑</el-button>

						<el-popconfirm title="确认删除?">
							<template #reference>
								<el-button link type="danger" size="small">删除</el-button>
							</template>
						</el-popconfirm>
					</template>
				</el-table-column>
			</el-table>
		</el-card>




	</div>
</template>

<script lang="ts" setup>
	const tableData = [
		{
			id: "1",
			shopName: '红烧肉',
			phone: '010-12345678',
			status: '正常',
			createTime: '2022-01-01',
			updateTime: '2022-01-01',
			shopLogo: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
			shopCover: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
		},
		{
			id: "2",
			shopName: '红烧肉',
			phone: '010-12345678',
			status: '正常',
			createTime: '2022-01-01',
			updateTime: '2022-01-01',
			shopLogo: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
			shopCover: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
		},
		{
			id: "3",
			shopName: '红烧肉',
			phone: '010-12345678',
			status: '正常',
			createTime: '2022-01-01',
			updateTime: '2022-01-01',
			shopLogo: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
			shopCover: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
		},
	]
</script>

<style>
</style>